<template>
	<view>
		<view >
			<view class="topbox paddingLR32 relative" style="top: 0;overflow: hidden;"  >  
				<image src="../../static/images/mine/bgc.png" mode="" style="position: absolute;width: 100%;height:300rpx;left: 0;top: 0;"></image>
				<view class="flexJBC" style="margin-top: 60rpx;">
					<view class="fontS40 " ></view>
					<view class="flex" :style="{marginTop: tabh}"> 
						<view class="paddingLR32" @click="gokefu">
							<u-icon name="kefu-ermai" size="24" color="#333"></u-icon>
						</view>
						<u-icon name="setting" size="24" color="#333"  @click="$my.go('/pages/my/set/index')"></u-icon>
					</view>
				</view>
				<view class="topImage flexJBC" @click="$my.go('/pages/my/userInfo')">
					<view class="flex">
						<image :src="userInfo.avatar"style="width: 120rpx;height:120rpx;border-radius:60rpx;" />
						<view class="user">
							<view class="fontS32">
								{{userInfo.nickname}}
							</view>
							<view class="co9" style="margin-top: 12rpx;">
								ID：{{userInfo.id}}
							</view>
						</view>
					</view>
					<u-icon name="arrow-right" size="12" color="#999" ></u-icon>
				</view>
			</view>
			<view class="flexJBC" style="padding:36rpx  180rpx 32rpx;">
				<view class="li center" v-if="false">
					<view class="fw7">
						<text class="fontS24">￥</text>
						<text class="fontS36">{{balance}}</text>
					</view>
					<view class="fontS24 co9" @click="$my.go('/pages/my/wallet/index')">
						钱包
					</view>
				</view>
				<view class="li center">
					<view class="unitPrice fw7 fontS36">
						{{userInfo.coupon}}
					</view>
					<view class="fontS24 co9" @click="$my.go('/pages/my/coupon')">
						优惠券
					</view>
				</view>
				<view class="li center" @click="$my.go('/pages/my/favourite')">
					<view class="unitPrice fw7 fontS36">
						{{userInfo.favorites}}
					</view>
					<view class="fontS24 co9">
						收藏夹
					</view>
				</view>
			</view>
			<view class="paddingLR32" >
				<view class="whiteBox mb32">
					<view class="flexJBC">
						<view class="">
							我的订单
						</view>
						<view class="fontS24 co9 flex" @click="$my.go('/pages/my/order/orderList?type=0')">
							<text>全部订单</text>
							<u-icon name="arrow-right" size="12" color="#999" ></u-icon>
						</view> 
					</view>
					<view class="flex" style="margin-top: 34rpx;">
						<view class="lis flexcenter" style="width: 20%;" @click="$my.go(item.path)" v-for="(item,index) in orderList" :key="index" >
							<u-image :src="item.image" :lazy-load="true" width="24" height="24" />
							<view class="fontS24" style="margin-top: 8rpx;">
								{{item.name}}
							</view>
						</view>
					</view>
				</view>
				<view class="whiteBox">
					<view class="flexJBC">
						<view class="">
							更多
						</view>
					</view>
					<view class="flex" style="margin-top: 34rpx;flex-wrap: wrap;">
						<view class="lis flexcenter mb32" @click="$my.go(item.path)" style="width: 25%;" v-for="(item,index) in more" :key="index">
							<u-image :src="item.image" :lazy-load="true" width="28" height="28" />
							<view class="fontS24" style="margin-top: 8rpx;">
								{{item.name}}
							</view>
						</view>
					</view>
				</view>
				<List :list='list' :showSale='false' v-if="list.length>0"/>
			</view>
		</view>
		<TabBar :value="value" :changeValue='changeValue'/>
	</view>
</template>

<script>
	import List from  '@/componentes/list.vue'
	import TabBar from '@/componentes/TabBar.vue'
	export default { 
		data() {
			return {
			    tabh:this.$store.state.tabh,
				balance:0,
				page:1,
				list:[],//为你推荐
				userInfo:{},//获取用户信息
				value:3,
				more:[
					{name:'我的评价',path:'/pages/my/more/evaluation/myEvaluation',image:'/static/images/mine/Group 33266.png'},
					{name:'收货地址',path:'/pages/my/more/address/shippingAddress',image:'/static/images/mine/Group 33268.png'},
					{name:'浏览记录',path:'/pages/my/more/Browsinghistory',image:'/static/images/mine/Group 33269.png'},
					{name:'关注门店',path:'/pages/my/more/care',image:'/static/images/mine/Group 33270.png'},
					{name:'投诉/建议',path:'/pages/my/more/complaints',image:'/static/images/mine/Group 33271.png'},
					// {name:'渠道商申请',image:'/static/images/mine/Group 33272.png',path:'/pages/my/storeReginster'},
				],
				orderList:[
					{name:'待支付',image:'/static/images/mine/Group 33260.png',path:'/pages/my/order/orderList?type=1'},
					{name:'待发货',image:'/static/images/mine/Group 33261.png',path:'/pages/my/order/orderList?type=2'},
					{name:'待收货',image:'/static/images/mine/Group 33263.png',path:'/pages/my/order/orderList?type=3'},
					{name:'待评价',image:'/static/images/mine/Group 33264.png',path:'/pages/my/order/orderList?type=4'},
					{name:'退款/售后',image:'/static/images/mine/Group 33273.png',path:'/pages/my/order/refund/refundList'},
				]
			};
		},
		onShow() {
			// 获取用户个人信息
			this.$my.get('/index/user/get_user_info').then(res=>{
				if(res.code==200){
				   this.userInfo=res.data
				     this.balance=res.data.balance.balance
				   uni.setStorageSync('userInfo',res.data)
				}
			})
		}, 
		onLoad() {
			this.getList()
		},
		components:{
			TabBar,List
		},
		onReachBottom() {
			this.page++;
			this.getList()
		},
		methods:{
			//客服
			gokefu(){
				this.$my.post('/index/Im/getPlatFormKeFu').then(res=>{
					if(res.code==200){
						if(res.data.id){
							this.$my.go('/myPackageA/goodsAndFacton/kefu?id=' + res.data.tencent_user_id)
						}else if(!uni.getStorageSync('token')){
							this.$my.go('/myPackageA/login/login')
						}else{
							this.$my.toast('当前没有客服在线')
						}
					}
				})
			},
			// 为你推荐
			getList(){
				this.$my.post('/index/product/getProductRecommend',{limit:10,page:this.page}).then(res=>{
					if(res.code==200){
						this.list=this.list.concat(res.data.data)
					} 
				})
			},
			changeValue(e){
				this.value=e
				console.log(this.value)
			}
		}
	}
</script>
<style>
	page{
		padding-bottom: 200rpx;
	}
</style>
<style lang="less" scoped>
	.bottmotitle{
		align-items: center;
	}
	.user{
		margin-left: 24rpx;
	}
	.topImage{
		margin-top: 40rpx;
	}
	.topbox{ 
		width: 100%;
		min-height:300rpx;
		position: relative;
	}

</style>